<template>
	<view class="">
		<uni-forms :modelValue="formData">
			<uni-forms-item label="IP配置" name="ip">
				<uni-easyinput type="text" v-model="formData.ip" placeholder="请输入ip地址:192.168.1.100" />
			</uni-forms-item> 
			<uni-forms-item label="端口" name="port">
				<uni-easyinput type="text" v-model="formData.port" placeholder="请输入端口:80" />
			</uni-forms-item> 
		</uni-forms>
		<button @click="submitForm" type="primary" size="default">保存</button>
	</view>
</template>


<script>
import { onMounted } from 'vue'
	export default {
		data() {
			return {
				ip:"192.168.1.100",
				port:80,
				formData:{
					ip:"",
					port:80,
				}
			}
		},
		methods: {
			 validateIP(ip) {  
			      const ipRegex = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;  
			      return ipRegex.test(ip);  
			    }, 
			 submitForm(){
				 if(!this.validateIP(this.formData.ip)){
					 uni.showToast({
					 	duration:2000,
					 	icon:'error',
					 	title:'ip地址无效,请重新输入！'
					 })
					 this.formData.ip = '';
					 return false;
				 }
				 
				if(this.formData.ip != ''){
					localStorage.setItem('config_ip',this.formData.ip);
					localStorage.setItem('config_port',this.formData.port);
					uni.showModal({
						title:'保存配置',
						content:'是否保存配置',
						success() {
							uni.showToast({
								duration:2000,
								icon:'success',
								title:'已保存！'
							})
							uni.navigateTo({
								url:'/pages/index/index'
							})
						},
						fail() {
							uni.showToast({
								duration:2000,
								icon:'error',
								title:'保存失败！'
							})
						}
					})
				}else{
					uni.showToast({
						duration:2000,
						icon:'error',
						title:'地址配置不能为空！'
					})
				}
				
			}
		},
		onLoad(){
			if(localStorage.getItem('config_ip') ){
				this.formData.ip = localStorage.getItem('config_ip');
			}
		},
	}
</script>

<style>

</style>
